<template>
  <div class="popup-right">
    <div class="btn" @click="showPopup">筛选</div>
    <van-popup v-model="show" position="right" :style="{ height: '100%', width: '80%' }">
      <DSelect v-model="filters.area" readonly clickable label="位置" placeholder="请选择位置"></DSelect>
      <DSelect v-model="filters.state" readonly clickable label="状态" placeholder="请选择状态"></DSelect>
      <DSelect v-model="filters.kind" readonly clickable label="类型" placeholder="请选择类型"></DSelect>
    </van-popup>
  </div>
</template>

<script>
export default {
  name: 'PopupRight',
  data() {
    return {
      show: false,
      filters: {
        area: '',
        state: '',
        kind: ''
      }
    }
  },
  methods: {
    showPopup() {
      this.show = true
    }
  }
}
</script>

<style lang="scss" scoped></style>